<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <!-- 引入bootstarp -->
    <script type="text/javascript" src="../js/bootstrap3/js/bootstrap.js"></script>
    <link rel="stylesheet" href="../js/bootstrap3/css/bootstrap.css">
    <!-- 引入bootstrap table的css、js -->
    <link type="text/css" rel="stylesheet" href="../js/bootstrap-table/bootstrap-table.css">
    <script type="text/javascript" src="../js/bootstrap-table/bootstrap-table.js"></script>
    <script type="text/javascript" src="../js/bootstrap-table/locale/bootstrap-table-zh-CN.js"></script>
    <!-- 引入bootstrap datetime的css、js -->
    <link type="text/css" rel="stylesheet" href="../js/bootstrap-datetimepicker/css/bootstrap-datetimepicker.css">
    <script type="text/javascript" src="../js/bootstrap-datetimepicker/js/bootstrap-datetimepicker.js"></script>
    <script type="text/javascript" src="../js/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
</head>
<body>
<div id="toolbar">
</div>
<table border="2" class="table" id="userTable" ></table>
</body>
<script>
    $(function(){
        initfahuo();
    })
    function searchBook(){
        $("#userTable").bootstrapTable('refresh',{
            query:{
                page:'1',
            }
        });
    }
    function initfahuo(){
        $("#userTable").bootstrapTable({
            toolbar:'#toolbar',
            url:'../wjs/dizi',
            method:'post',
            contentType:'application/x-www-form-urlencoded',//post请求按照表单方式
            pagination:true,
            pageSize:5,
            pageList:[2,5,6],
            pageNumber:1,
            clickToSelect: true,         //是否启用点击选中行
            sidePagination:'server',        //分页方式：client客户端分页，server服务端分页
            striped:true,          //斑马线
            queryParams:function(){
                return {
                    page:this.pageNumber,
                    rows:this.pageSize
                };
            },
            columns:[
                {field:'acceptProvince',title:'省'},
                {field:'acceptCity',title:'市'},
                {field:'acceptArea',title:'县'},
                {field:'acceptName',title:'收货人名称'},
                {field:'acceptPhone',title:'收货人电话'},
                {field:'acceptSite',title:'详细收货地址'},
                {field:'caozuo',title:'操作',formatter:function(value,row,index){
                    return '<a href="">'+value+'</a>'
                }}
            ]
        })
    }

</script>
</html>